<template>
	<view>
		<image src="/static/backpng/bg.jpg" mode=""
			style="position: fixed;width: 100%;height: 100%;filter: blur(1px);"></image>

		<view class="content">
			<!-- <text class="title">
			高标准农田
		</text> 
		<text class="title2">
			建设项目管理系统
		</text> -->
			<image class="logo" src="/static/shouyelogo.png" ></image>
			<view style="width: 70%;margin: 0rpx auto;">
				<uni-forms ref="form" :modelValue="form" :rules="rules">
					<uni-forms-item >
						<uni-easyinput prefixIcon="person" style="color: #000000;" v-model="form.username" focus
							placeholder="请输入账号"></uni-easyinput>
					</uni-forms-item>

					<uni-forms-item  > 
						<uni-easyinput prefixIcon="locked" type="password" style="color: #000000; "v-model="form.password" placeholder="请输入密码"></uni-easyinput>
					</uni-forms-item>
				</uni-forms>
				<view style="margin: 0rpx 0;"><button type="primary" style="background-color: #f59c07;width: 100%" @click="login">登
						录</button></view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					username: '',
					password: ''
				},
				rules: {
					// 对username字段进行必填验证
					username: {
						rules: [{
							required: true,
							errorMessage: '请输入用户名',
						}],
						validateTrigger: 'submit'
					},
					// 对password字段进行必填验证
					password: {
						rules: [{
							required: true,
							errorMessage: '请输入密码',
						}],
						validateTrigger: 'submit'
					}

				}
			}
		},
		methods: {
			login() {
				//表单校验
				this.$refs.form.validate().then(res => {
					console.log(this.form)
					this.$myrequest({
						url: '/sys/user/login/app',
						method: "POST",
						data: this.form
					}).then(res => {
						uni.showToast({
							title: '登录成功'
						})
						//存储用户token数据到storge
						uni.setStorageSync('authorization', res.data.accessToken)
						this.$myrequest({
							url: '/sys/user',
							method: "GET",
							data: {}
						}).then(resuser => {
							uni.setStorageSync('userInfo', resuser.data)
						})
						console.log(uni.getStorageInfoSync('authorization'))
						//跳转页面 当首页含有tarbar的时候使用下面方式跳转
						uni.switchTab({
							url: '/pages/home/home'
						})

					})
				}).catch(err => {
					console.log('表单校验失败！', err)
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 350rpx;
		width: 350rpx;
		margin-top: 100rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}
	.input{
		
	}
</style>
